<template>
  <el-drawer
    title="需求批量导入"
    size="60%"
    :visible.sync="drawerVisible"
    direction="rtl"
    :close-on-press-escape="false"
    :wrapperClosable="false"
    :destroy-on-close="true"
    :before-close="beforeClose"
    custom-class="tag-drawer batch-drawer demand-batch-drawer"
    v-drawerResize
  >
    <tag-import
      ref="tagImport"
      :type="1"
      :nodeId="35"
      :config="config"
      :closeAfterSave="false"
      hasSimilar
      @close="close"
    ></tag-import>
    <div class="drawer-btns">
      <el-button size="medium" @click="beforeClose()">取消</el-button>
      <el-button type="primary" size="medium" v-if="config.stepNumber === 0" @click="handleDownload">
        模板下载
      </el-button>
      <el-button type="primary" size="medium" v-else @click="reset">重新上传</el-button>
      <el-button type="primary" @click="back" v-if="config.stepNumber === 3">上一步</el-button>
      <el-button type="primary" size="medium" @click="next" v-if="!config.error && config.stepNumber < 3">
        下一步
      </el-button>
      <el-button type="primary" size="medium" v-if="!config.error && config.stepNumber === 3" @click="submit"
        >提交</el-button
      >
    </div>
  </el-drawer>
</template>

<script>
let previewUrl = 'ast/astTagRequire/excel'
let submitUrl = 'ast/astTagRequireManager/submitBatchRequire'
export default {
  data() {
    return {
      drawerVisible: false,
      config: {
        previewUrl: previewUrl,
        submitUrl: submitUrl,
        stepNumber: 0,
        error: false
      }
    }
  },
  methods: {
    showDrawer() {
      this.drawerVisible = true
    },
    reset() {
      this.$refs.tagImport.reset()
      this.config = {
        previewUrl: previewUrl,
        submitUrl: submitUrl,
        stepNumber: 0,
        error: false
      }
    },
    back() {
      this.$refs.tagImport.back()
    },
    next() {
      this.$refs.tagImport.next()
    },
    submit() {
      this.$refs.tagImport.submit(false)
    },
    beforeClose() {
      var close = true
      var msg = ''
      if (this.config.stepNumber > 0) {
        close = false
        msg = '确定要取消导入吗？'
      }
      if (close) {
        this.reset()
        this.drawerVisible = false
        this.$emit('callback')
      } else {
        this.$confirm(msg)
          .then(() => {
            this.reset()
            this.drawerVisible = false
            this.$emit('callback')
          })
          .catch(() => {})
      }
    },
    handleDownload() {
      this.$ajax({
        url: this.$ajax.setUrl('ast/astTagRequire/tmpl'),
        method: 'get',
        params: this.$ajax.setParams({
          tmplId: 1
        })
      }).then(({ data }) => {
        if (data && data.code === '0') {
          this.$dlFile(data.data)
        } else {
          this.$message.error(data.data || data.msg)
        }
      })
    },
    close() {
      this.reset()
      this.drawerVisible = false
      this.$emit('callback')
    }
  }
}
</script>

<style lang="scss">
.tag-drawer.demand-batch-drawer {
  .el-drawer__body {
    .drawer-wrap {
      top: 100px;
      &.disabled {
        bottom: 0;
      }
    }
  }
}
</style>
